<template>
  <div class="about">
    <h1>This is an about page</h1>
    <a-select
      v-model:value="value2"
      :options="options"
      mode="multiple"
      :size="size"
      placeholder="Please select"
      style="width: 200px"
      @popupScroll="popupScroll"
      @select="selectTag"
      @deselect="selectTag"
    ></a-select>
  </div>
</template>
<script setup lang="ts">
import { ref } from "vue";
import { SelectProps } from "ant-design-vue";

const value2 = ref(["a1", "b2"]);
const size = ref<SelectProps["size"]>("middle");
const options = [...Array(25)].map((_, i) => ({
  value: (i + 10).toString(36) + (i + 1),
}));
const popupScroll = () => {
  console.log("popupScroll");
};
const selectTag = () => {
  console.log(value2.value);
};
</script>

<style scoped></style>
